<template>
  <div class="hello">
    <h2>用户注册</h2>
    用户名：<input type="text" v-model="username"><br><br>
    密码：<input type="text" v-model="password1"><br><br>
    确认密码：<input type="text" v-model="password2"><br><br>
    手机号：<input type="text" v-model="phone"><br><br>
    邮箱：<input type="text" v-model="email"><br><br>
    角色：<section name="provices" v-model="role_id">
          <option value="小白">小白</option>
          <option value="tt">tt</option>
          </section>
    <button @click="denglu">注册</button>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      username:'',
      password1:'',
      password2:'',
      phone:'',
      email:'',
      role_id:0
    }
  },
  methods:{
      denglu:function(){
        if(!this.username){
          alert('用户名不能为空！')
        }
          let formdata = new FormData();
          formdata.append('username',this.username);
          formdata.append('password1',this.password1);
          formdata.append('password2',this.password2);
          formdata.append('phone',this.phone);
          formdata.append('email',this.email);
          formdata.append('role',this.role_id)
          this.axios({
              url:'http://127.0.0.1:8000/app01/register/',
              method:'post',
              data:formdata
          }).then(res=>{
              if (res.data.code==200){
                  alert('注册成功！')
              }else{
                  alert(res.data.msg)
              }
          })
      }
  }
}
</script>